<script type="text/javascript" src="/js/functions/groups.js"></script>
<div class="fl-option-toolbar">
    <div class="fl-groups-icon icon"></div>
    <div class="fl-toolbar-left-wrapper">
      <h1>Groups</h1>
    </div>
    <div class="fl-toolbar-right-wrapper">
       <!--  <a class="pinit icon dataTip" data-placement="left" data-original-title="Pin this to Dashboard"></a> -->
    </div>
     <div class="clearfix"></div>
  </div><!-- end of option toolbar -->
<div class="fl-message-wrapper">
 
   <?php
      $auth = Auth::getAuth('current_user');
      $userCompany = new userQueries();
   ?>
   <div class="fl-left-wrapper">
      <div class="fl-head-title-wrapper">
           <p>List of Groups <strong class="counter groupCount" style="position:absolute; top:7px;">0</strong></p>
      </div>
      <div class="scrollbarM fl-left-wrapper-content">
         <div class="fl-inbox-item-wrapper">
            <!-- <div class="scrollbarM contentHolder"> -->
               <ul class="group_lists">
                  <center>
                   <!--  <img src="/images/loader/loader.gif" class="display load_m offsetTop5" />-->
                     <div class="spinner">
                         <div class="bar1"></div>
                         <div class="bar2"></div>
                         <div class="bar3"></div>
                         <div class="bar4"></div>
                         <div class="bar5"></div>
                         <div class="bar6"></div>
                        <div class="bar7"></div>
                        <div class="bar8"></div>
                        <div class="bar9"></div>
                        <div class="bar10"></div>
                   </div>
                 </center> 

               </ul>
            <!--</div> -->
         </div>
      </div>    
   </div>
    <div class="fl-right-wrapper">
       <div class="fl-head-title-wrapper">
          <label class="conversationTo" style="font-size: 12px;">Create Group</label>
          <div class="fl-head-menu-wrapper">
          </div>
          <div class="clearfix"></div>
        </div>
        <div id="fl-no-conversation-wrapper " class="msg_container">
        <ul class="scrollbarP messagesOne contentHolder pull-left fl-box-sizing">
          <div id="" style="float: left;border: 1px solid #ddd;min-height: 40px;margin-top: 5px;width: 100%;padding-bottom: 8px;">
            <div style="float:left;margin-top: 13px;margin-left:12px;font-weight: bold;font-size: 12px;">Name: <font color="red">*</font></div>
            <input type="text" id="" class="input-small gName" style="border: none;box-shadow:none;margin-left: 12px;margin-top: 8px;width:88%; background-color:#fafafa;">
          </div>
          <div id="userList" style="float: left;border: 1px solid #ddd;min-height: 40px;margin-top: 5px;width: 100%;padding-bottom: 8px;">
             <div style="float:left;margin-top: 13px;margin-left:12px;font-weight: bold;font-size: 12px;">
                Members: <font color="red">*</font>
             </div>
                <input type="text" id="listRecipient1" class="input-small msgBoxTo" data-tag-id="0" style="border: none;box-shadow:none;margin-left: 12px;margin-top: 8px; background-color:#fafafa">
          </div>
          <div style="float: left;width: 100.2%;">
               <div id="displayUser1"></div>
          </div> 
          <input type="button" class="btn-basicBtn pull-right cancel_update fl-buttonEffect" value="Cancel" style="margin-top:10px;">
          <input type="button" class="btn-blueBtn pull-right addGroup" value="Save" style="margin-top:10px; margin-right:5px;">      
        </ul>
        <Br/><Br/>
      </div><!-- end of no conversation -->
      <div class="clearfix"></div>
    </div><!-- end of fl-right -->
      <div class="clearfix"></div>
</div>